<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>注册</title>
    <base href="http://localhost:8080/LoginTest/">
    <script type="text/javascript" src="static/script/jquery-1.7.2.js"></script>
    <script type="text/javascript">
        $(function () {
            $("#btn_summit").click(function () {
                //验证用户名
                var usernameText = $("#username").val();
                var userNamePatt=/^\w{6,16}$/;
                if (!userNamePatt.test(usernameText)){
                    $("#ErorUserNameText").text("用户名格式错误");
                    return false;
                }
                $("#ErorUserNameText").text("");

                //验证密码
                var passwordText = $("#password").val();
                var passwordPatt = /^\w{6,16}$/;
                if (!passwordPatt.test(passwordText)){
                    $("#ErorPassWordText").text("密码格式错误");
                    return false;
                }
                $("#ErorPassWordText").text("");

                //确认密码
                var reLookPasswordText = $("#reLookPassword").val();
                if (reLookPasswordText!=passwordText){
                    $("#ErorReLookPassword").text("与密码不一致");
                    return false;
                }
                $("#ErorReLookPassword").text("");

                //邮箱验证
                var emailText=$("#email").val();
                var emailPatt=/^[a-z\d]+(\.[a-z\d]+)*@([\da-z](-[\da-z])?)+(\.{1,2}[a-z]+)+$/;
                if (!emailPatt.test(emailText)){
                    $("#ErorEmail").text("邮箱格式错误");
                    return false;
                }
                $("#ErorEmail").text("");

                //【验证码】验证：需要服务器，后期补充，这里只提供非空即可
                var codeText = $("#code").val();
                //去除验证码的前后空格
                codeText = $.trim(codeText);
                if (codeText==null||codeText==""){
                    $("#ErorMsg").text("验证码不能为空");
                    return false;
                }
                $("#ErorMsg").text("");
            });
        })
    </script>
</head>
<body>
<h1>注册页面</h1>
<form action="registServlet" method="post">
    账号<input type="text" name="username" id="username">
    <span id="ErorUserNameText" style="color: red"></span><br>
    密码<input type="password" name="password" id="password">
    <span id="ErorPassWordText" style="color: red"></span><br>
    确认密码<input type="password" id="reLookPassword">
    <span id="ErorReLookPassword" style="color: red"></span><br>
    邮箱<input type="text" name="email" id="email">
    <span style="color: red" id="ErorEmail"></span><br>
    验证码：<input type="text" name="code" id="code">
    <span id="ErorMsg" style="color: red"></span>
    <input type="submit" id="btn_summit">
</form>
</body>
</html>